import {onMounted, reactive} from "plain-ui-composition";
import {iVisualData} from "../../packages/utils/types.base";
import {$http} from "../http";

export const createEmptyComponent = (obj = {}) => {
  return Object.assign({
    name: '栏目',
    code: 'rows-container',
    // group: '样式',
    onlyType: true,
    // isComom: true,
    style: {
      display: 'block'
    },
    data: {
      rowsNum: 1
    },
    childrenData: [],
    id: Math.random()
  }, obj)
}
export function useRemoveData() {
  const state = reactive({
    value: null as null | iVisualData
  });
  onMounted(async () => {
    const url = new URL(window.location.href);
    const code = url.searchParams.get('code');
    if (!!code) {
      state.value = JSON.parse((await $http.post('/cms/item', { id: code })).result.json);
    } else {
      state.value = {
        pages: [{
          name: '画布',
          show: true,
          gutter: 0,
          widthRange: {
            start: 0,
            end: 'max'
          },
          design: {
            width: 1200,
            minHeight: 750
          },
          id: 1,
          style: {
            backgroundColor: 'var(--global-site-painter-color)'
          },
          childrenData: [
            createEmptyComponent({
              name: '页首',
              groupType: 'header',
              isContent: true
            }),
            createEmptyComponent({
              name: '页面正文',
              groupType: 'content',
              isContent: true
            }),
            createEmptyComponent({
              name: '页尾',
              groupType: 'footer',
              isContent: true
            })
          ]
        }]
      };
    }
  });
  return state;
}
